import { Tsrv } from '@/services';
import VXETable from 'vxe-table';
import { VXETableConfigOptions } from 'vxe-table/types';
import { i18n } from './i18n.config';

const vxeSetup: VXETableConfigOptions = {
  size: 'mini', // 全局尺寸
  zIndex: 100, // 全局 zIndex 起始值，如果项目的的 z-index 样式值过大时就需要跟随设置更大，避免被遮挡
  version: 0, // 版本号，对于某些带数据缓存的功能有用到，上升版本号可以用于重置数据

  icon: {
    LOADING: 'wy-icon wy-spinner roll vxe-loading--default-icon',
    // table
    TABLE_SORT_ASC: 'wy-icon wy-shangjiantou',
    TABLE_SORT_DESC: 'wy-icon wy-xiajiantou',
    TABLE_FILTER_NONE: 'wy-icon wy-funnel',
    TABLE_FILTER_MATCH: 'wy-icon wy-funnel',
    TABLE_EDIT: 'wy-icon wy-rule-edit',
    TABLE_HELP: 'wy-icon wy-question-circle-fill',
    TABLE_TREE_LOADED: 'wy-icon wy-spinner roll',
    TABLE_TREE_OPEN: 'wy-icon wy-field-filter',
    TABLE_TREE_CLOSE: 'wy-icon wy-next',
    TABLE_EXPAND_LOADED: 'wy-icon wy-spinner roll',
    TABLE_EXPAND_OPEN: 'wy-icon wy-xiala',
    TABLE_EXPAND_CLOSE: 'wy-icon wy-fanhui',
    TABLE_CHECKBOX_CHECKED: 'wy-icon wy-checkboxchecked',
    TABLE_CHECKBOX_UNCHECKED: 'wy-icon wy-checkbox',
    TABLE_CHECKBOX_INDETERMINATE: 'wy-icon wy-indeterminate_check_box',
    TABLE_RADIO_CHECKED: 'wy-icon wy-checkboxchecked',
    TABLE_RADIO_UNCHECKED: 'wy-icon wy-checkbox',
    // button
    BUTTON_DROPDOWN: 'wy-icon wy-xiala',
    BUTTON_LOADING: 'wy-icon wy-spinner roll',
    // select
    SELECT_LOADED: 'wy-icon wy-spinner roll',
    SELECT_OPEN: 'wy-icon wy-shangsanjiao',
    SELECT_CLOSE: 'wy-icon wy-xiasanjiao',
    // pager
    PAGER_JUMP_PREV: 'wy-icon wy-shangyiye',
    PAGER_JUMP_NEXT: 'wy-icon wy-xiayiye',
    PAGER_PREV_PAGE: 'wy-shangyiye1',
    PAGER_NEXT_PAGE: 'wy-xiayiye1',
    PAGER_JUMP_MORE: 'wy-icon wy-gengduo',
    // input
    INPUT_CLEAR: 'wy-icon wy-error-circle-fill',
    INPUT_PWD: 'wy-icon wy-eye-fill',
    INPUT_SHOW_PWD: 'wy-icon wy-eye-close',
    INPUT_PREV_NUM: 'wy-shangsanjiao',
    INPUT_NEXT_NUM: 'wy-icon wy-xiasanjiao',
    INPUT_DATE: 'wy-icon wy-calendar',
    INPUT_SEARCH: 'wy-icon wy-sousuo13',
    // modal
    MODAL_ZOOM_IN: 'wy-icon wy-square',
    MODAL_ZOOM_OUT: 'wy-icon wy-maximize',
    MODAL_CLOSE: 'wy-icon wy-close',
    MODAL_INFO: 'wy-icon wy-info-circle-fill',
    MODAL_SUCCESS: 'wy-icon wy-success-circle-fill',
    MODAL_WARNING: 'wy-icon wy-warning-circle-fill',
    MODAL_ERROR: 'wy-icon wy-error-circle-fill',
    MODAL_QUESTION: 'wy-icon wy-question-circle-fill',
    MODAL_LOADING: 'wy-icon wy-spinner roll',
    // toolbar
    TOOLBAR_TOOLS_REFRESH: 'wy-icon wy-repeat',
    TOOLBAR_TOOLS_REFRESH_LOADING: 'wy-icon wy-repeat roll',
    TOOLBAR_TOOLS_IMPORT: 'wy-icon wy-upload',
    TOOLBAR_TOOLS_EXPORT: 'wy-icon wy-download',
    TOOLBAR_TOOLS_PRINT: 'wy-icon wy-print',
    TOOLBAR_TOOLS_FULLSCREEN: 'wy-icon wy-quanping_o',
    TOOLBAR_TOOLS_MINIMIZE: 'wy-icon wy-shouqiquanping',
    TOOLBAR_TOOLS_CUSTOM: 'wy-icon wy-lieshezhi',
    TOOLBAR_TOOLS_FIXED_LEFT: 'wy-icon wy-fixed-left',
    TOOLBAR_TOOLS_FIXED_LEFT_ACTIVED: 'wy-icon wy-fixed-left-filled',
    TOOLBAR_TOOLS_FIXED_RIGHT: 'wy-icon wy-fixed-right',
    TOOLBAR_TOOLS_FIXED_RIGHT_ACTIVED: 'wy-icon wy-fixed-right-filled',
    // form
    FORM_PREFIX: 'wy-icon wy-question-circle-fill',
    FORM_SUFFIX: 'wy-icon wy-question-circle-fill',
    FORM_FOLDING: 'wy-icon wy-xiala',
    FORM_UNFOLDING: 'wy-icon wy-shouqi'
  },
  table: {
    showHeader: true, // 显示表头
    keepSource: true,
    showOverflow: 'tooltip', // overflow的显示方式
    showHeaderOverflow: true, // 显示表头的overflow
    resizable: true, // 可调整列宽度
    checkboxConfig: {
      reserve: true,
      highlight: true
    },
    rowId: '_XID', // 行数据的唯一主键字段名
    tooltipConfig: {
      theme: 'light'
    },
    scrollX: {
      enabled: false,
      oSize: 10
    },
    scrollY: {
      enabled: true,
      oSize: 10
    }
  },
  grid: {},
  pager: {
    // size: null,
    total: 0,
    currentPage: 1,
    pageSize: 10,
    align: 'right',
    pageSizes: [10, 20, 50, 100],
    layouts: [
      'Sizes',
      'PrevJump',
      'PrevPage',
      'Number',
      'NextPage',
      'NextJump',
      'Total'
    ],
    perfect: true,
    autoHidden: true
  },
  form: {
    // size: null,
    titleColon: true
  },
  input: {
    // size: null,
    // transfer: false
    // parseFormat: 'yyyy-MM-dd HH:mm:ss.SSS',
    // labelFormat: '',
    // valueFormat: '',
    startWeek: 1,
    digits: 2
  },
  // textarea: {
  // size: null
  // autosize: {
  //   minRows: 1,
  //   maxRows: 10
  // }
  // },
  // select: {
  // size: null,
  // transfer: false
  // },
  // toolbar: {
  // size: null,
  // import: {
  //   mode: 'covering'
  // },
  // export: {
  //   types: ['csv', 'html', 'xml', 'txt']
  // },
  // resizable: {
  //   storage: false
  // },
  // custom: {
  //   storage: false,
  //   isFooter: true
  // },
  // buttons: []
  // },
  // button: {
  // size: null,
  // transfer: false
  // },
  // radio: {
  // size: null
  // },
  // checkbox: {
  // size: null
  // },
  // switch: {
  // size: null
  // },
  modal: {
    // size: null,
    minWidth: 340,
    minHeight: 200,
    lockView: true,
    mask: true,
    duration: 3000,
    marginSize: 8,
    dblclickZoom: true,
    showTitleOverflow: true
    // storage: false
  },
  translate: (key: string) =>
    i18n.te(`i18n.${key}`) ? i18n.t(`i18n.${key}`).toString() : key
};
VXETable.setConfig(vxeSetup);

VXETable.formats.mixin({
  i18nFormatter({ cellValue }) {
    const path = `i18n.${cellValue}`;
    return i18n.te(path) ? i18n.t(path) : cellValue;
  },
  numberFormatter(data, format) {
    const cellValue: string = data.cellValue || '';
    let res = cellValue;

    if (format) {
      if (format.type !== '') {
        switch (format.type) {
          case 'number':
            if (format.thousandmark) {
              // res = Tsrv.utils.toFixedString(cellValue, format.decimal || 2);
              res = Number(cellValue).toFixed(format.decimal || 2);
              res = Tsrv.utils.commafy(res);
            } else {
              // res = Tsrv.utils.toFixedString(cellValue, format.decimal || 2);
              res = Number(cellValue).toFixed(format.decimal || 2);
            }
            break;
          case 'currency':
            res = Tsrv.utils.toFixedString(cellValue, format.decimal || 2);
            res = format.currency + Tsrv.utils.commafy(res);
            break;
          case 'percent':
            res = Tsrv.utils.toString(Tsrv.utils.toNumber(cellValue) * 100);
            res = `${Tsrv.utils.toFixedString(res, format.decimal || 2)}%`;
            break;
          default:
            break;
        }
      }
    }
    return res === '' ? null : res;
  },
  bitFormatter({ cellValue }) {
    if (cellValue === 0) {
      return i18n.t('others.no');
    }
    if (cellValue === 1) {
      return i18n.t('others.yes');
    }
    return cellValue;
  }
});

VXETable.renderer.add('notData', {
  renderTableEmptyView(h, renderOpts) {
    return [<span>{i18n.t('others.nodata')}</span>];
  }
});

VXETable.renderer.add('oFilterInput', {
  renderTableFilter(h, renderOpts, params) {
    return [<oFilterInput params={params}></oFilterInput>];
  },
  tableFilterMethod({ option, row, column }) {
    const { data } = option;
    // const cellValue = Tsrv.utils.get(row, column.property);
    const cellValue = Tsrv.utils.get(row, column.field);
    return Tsrv.utils.toString(cellValue).indexOf(data) > -1;
  },
  tableFilterResetMethod({ options, column }) {
    options[0]['list'] = [];
    options[0]['advance'] = {};
    column.params.loadedFilterList = [];
  }
});

VXETable.renderer.add('oInput', {
  tableAutofocus: '.ivu-input',
  // 项内容模板
  renderFormItemContent(h, renderOpts, params) {
    return <oInput renderOpts={renderOpts} params={params}></oInput>;
  },
  renderTableEdit(h, renderOpts, params) {
    return [<oInput renderOpts={renderOpts} params={params}></oInput>];
  },
  renderTableCell(h, renderOpts, params) {
    return [<oInputCell renderOpts={renderOpts} params={params}></oInputCell>];
  }
});

VXETable.renderer.add('oAuxInput', {
  tabletableAutofocus: '.ivu-input',
  renderFormItemContent(h, renderOpts, params) {
    return [<oAuxInput renderOpts={renderOpts} params={params}></oAuxInput>];
  },
  renderTableEdit(h, renderOpts, params) {
    return [<oAuxInput renderOpts={renderOpts} params={params}></oAuxInput>];
  },
  renderTableCell(h, renderOpts, { row, column }) {
    return [<span>{row[column.field]}</span>];
  }
});

VXETable.renderer.add('oDatePicker', {
  tableAutofocus: '.ivu-input',
  renderFormItemContent(h, renderOpts, params) {
    return [
      <oDatePicker renderOpts={renderOpts} params={params}></oDatePicker>
    ];
  },
  renderTableEdit(h, renderOpts, params) {
    return [
      <oDatePicker renderOpts={renderOpts} params={params}></oDatePicker>
    ];
  },
  renderTableCell(h, renderOpts, { row, column }) {
    return [
      <span>
        {renderOpts.formatter(
          // row[column.property],
          row[column.field],
          renderOpts.props.format,
          renderOpts.props.type
        )}
      </span>
    ];
  }
});
VXETable.renderer.add('oI18nSelector', {
  tableAutofocus: '.ivu-input',
  renderFormItemContent(h, renderOpts, params) {
    return [
      <oI18nSelector renderOpts={renderOpts} params={params}></oI18nSelector>
    ];
  },
  renderTableEdit(h, renderOpts, params) {
    return [
      <oI18nSelector renderOpts={renderOpts} params={params}></oI18nSelector>
    ];
  },
  renderTableCell(h, renderOpts, params) {
    return [
      <oI18nSelectorCell
        renderOpts={renderOpts}
        params={params}
      ></oI18nSelectorCell>
    ];
  }
});
VXETable.renderer.add('oM2oSelector', {
  tableAutofocus: '.ivu-input',
  renderFormItemContent(h, renderOpts, params) {
    return [
      <oM2oSelector renderOpts={renderOpts} params={params}></oM2oSelector>
    ];
  },
  renderTableEdit(h, renderOpts, params) {
    return [
      <oM2oSelector renderOpts={renderOpts} params={params}></oM2oSelector>
    ];
  },

  renderTableCell(h, renderOpts, params) {
    return [<oM2oCell renderOpts={renderOpts} params={params}></oM2oCell>];
  }
});
VXETable.renderer.add('oIdRender', {
  renderTableCell(h, renderOpts, params) {
    return [<oIdRender renderOpts={renderOpts} params={params}></oIdRender>];
  },
  renderFormItemContent(h, renderOpts, params) {
    return [<oIdRender renderOpts={renderOpts} params={params}></oIdRender>];
  },
  renderTableEdit(h, renderOpts, params) {
    return [<oIdRender renderOpts={renderOpts} params={params}></oIdRender>];
  }
});
VXETable.renderer.add('oSeqRender', {
  renderTableCell(h, renderOpts, params) {
    return [<oSeqRender renderOpts={renderOpts} params={params}></oSeqRender>];
  },
  renderFormItemContent(h, renderOpts, params) {
    return [<oSeqRender renderOpts={renderOpts} params={params}></oSeqRender>];
  },
  renderTableEdit(h, renderOpts, params) {
    return [<oSeqRender renderOpts={renderOpts} params={params}></oSeqRender>];
  }
});
VXETable.renderer.add('oFileInput', {
  renderFormItemContent(h, renderOpts, params) {
    return [<oFileInput renderOpts={renderOpts} params={params}></oFileInput>];
  },
  renderTableEdit(h, renderOpts, params) {
    return [<oFileInput renderOpts={renderOpts} params={params}></oFileInput>];
  },
  renderTableCell(h, renderOpts, params) {
    return [
      <oFileInputCell renderOpts={renderOpts} params={params}></oFileInputCell>
    ];
  }
});
VXETable.renderer.add('oNumberInput', {
  tableAutofocus: '.ivu-input',
  renderFormItemContent(h, renderOpts, params) {
    return [
      <oNumberInput renderOpts={renderOpts} params={params}></oNumberInput>
    ];
  },
  renderTableEdit(h, renderOpts, params) {
    return [
      <oNumberInput renderOpts={renderOpts} params={params}></oNumberInput>
    ];
  },
  renderTableCell(h, renderOpts, { row, column }) {
    return [
      <span>
        {row[column.field] !== 0 && Tsrv.utils.toNumber(row[column.field]) === 0
          ? null
          : Tsrv.utils.toNumber(row[column.field])}
      </span>
    ];
  }
});
VXETable.renderer.add('oNumberInputRange', {
  tableAutofocus: '.ivu-input',
  renderFormItemContent(h, renderOpts, params) {
    return [
      <oNumberInputRange
        renderOpts={renderOpts}
        params={params}
      ></oNumberInputRange>
    ];
  },
  renderTableEdit(h, renderOpts, params) {
    return [
      <oNumberInputRange
        renderOpts={renderOpts}
        params={params}
      ></oNumberInputRange>
    ];
  },
  renderTableCell(h, renderOpts, { row, column }) {
    return [<span>{row[column.field]}</span>];
  }
});
VXETable.renderer.add('oSelect', {
  tableAutofocus: '.ivu-input',
  renderFormItemContent(h, renderOpts, params) {
    return [<oSelect renderOpts={renderOpts} params={params}></oSelect>];
  },
  renderTableEdit(h, renderOpts, params) {
    return [<oSelect renderOpts={renderOpts} params={params}></oSelect>];
  },
  renderTableCell(h, renderOpts, params) {
    return [
      <oSelectCell renderOpts={renderOpts} params={params}></oSelectCell>
    ];

    // renderTableCell(h, renderOpts, { row, column }) {
    // return [
    //   <span>
    //     {renderOpts.props.optionLoaded
    //       ? Tsrv.getI18nBySrv(
    //           Tsrv.utils.get(
    //             Tsrv.utils.find(
    //               renderOpts.props.optionLoaded,
    //               (el: any) => el.value === row[column.field]
    //             ),
    //             'label'
    //           )
    //         )
    //       : null}
    //   </span>
    // ];
  }
});
VXETable.renderer.add('oSwitch', {
  renderFormItemContent(h, renderOpts, params) {
    return [<oSwitch renderOpts={renderOpts} params={params}></oSwitch>];
  },
  renderTableEdit(h, renderOpts, params) {
    return [<oSwitch renderOpts={renderOpts} params={params}></oSwitch>];
  },
  renderTableCell(h, renderOpts, params) {
    return [<oSwitch renderOpts={renderOpts} params={params}></oSwitch>];
  }
});
VXETable.renderer.add('oImageSelector', {
  renderFormItemContent(h, renderOpts, params) {
    return [
      <oImageSelector renderOpts={renderOpts} params={params}></oImageSelector>
    ];
  },
  renderTableEdit(h, renderOpts, params) {
    return [
      <oImageSelector renderOpts={renderOpts} params={params}></oImageSelector>
    ];
  },
  renderTableCell(h, renderOpts, params) {
    return [
      <oImageSelectorCell
        renderOpts={renderOpts}
        params={params}
      ></oImageSelectorCell>
    ];
  }
});
VXETable.renderer.add('oColorSelector', {
  renderFormItemContent(h, renderOpts, params) {
    return [
      <oColorSelector renderOpts={renderOpts} params={params}></oColorSelector>
    ];
  },
  renderTableEdit(h, renderOpts, params) {
    return [
      <oColorSelector renderOpts={renderOpts} params={params}></oColorSelector>
    ];
  },
  renderTableCell(h, renderOpts, params) {
    return [
      <oColorSelectorCell
        renderOpts={renderOpts}
        params={params}
      ></oColorSelectorCell>
    ];
  }
});
VXETable.renderer.add('oRadio', {
  renderFormItemContent(h, renderOpts, params) {
    return [<oRadio renderOpts={renderOpts} params={params}></oRadio>];
  },
  renderTableEdit(h, renderOpts, params) {
    return [<oRadio renderOpts={renderOpts} params={params}></oRadio>];
  },
  renderTableCell(h, renderOpts, params) {
    return [<oRadio renderOpts={renderOpts} params={params}></oRadio>];
  }
});
VXETable.renderer.add('oIconbox', {
  renderFormItemContent(h, renderOpts, params) {
    return [<oIconbox renderOpts={renderOpts} params={params}></oIconbox>];
  },
  renderTableEdit(h, renderOpts, params) {
    return [<oIconbox renderOpts={renderOpts} params={params}></oIconbox>];
  },
  renderTableCell(h, renderOpts, params) {
    return [<oInputCell renderOpts={renderOpts} params={params}></oInputCell>];
  }
});
VXETable.renderer.add('oRichText', {
  renderFormItemContent(h, renderOpts, params) {
    return [<oRichText renderOpts={renderOpts} params={params}></oRichText>];
  },
  renderTableEdit(h, renderOpts, params) {
    return [<oRichText renderOpts={renderOpts} params={params}></oRichText>];
  },
  renderTableCell(h, renderOpts, params) {
    return [
      <oRichTextCell renderOpts={renderOpts} params={params}></oRichTextCell>
    ];
  }
});
VXETable.renderer.add('oControl', {
  renderFormItemContent(h, renderOpts, params) {
    return [<oColtrol renderOpts={renderOpts} params={params}></oColtrol>];
  },
  renderTableEdit(h, renderOpts, params) {
    return [<oColtrol renderOpts={renderOpts} params={params}></oColtrol>];
  },
  renderTableCell(h, renderOpts, params) {
    return [<oColtrol renderOpts={renderOpts} params={params}></oColtrol>];
  }
});
VXETable.renderer.add('oSearch', {
  renderFormItemContent(h, renderOpts, params) {
    return <oSearch renderOpts={renderOpts} params={params}></oSearch>;
  },
  renderTableEdit(h, renderOpts, params) {
    return [<oSearch renderOpts={renderOpts} params={params}></oSearch>];
  },
  renderTableCell(h, renderOpts, params) {
    return [<oSearch renderOpts={renderOpts} params={params}></oSearch>];
  }
});
VXETable.renderer.add('oMultiSelector', {
  renderFormItemContent(h, renderOpts, params) {
    return (
      <oMultiSelector renderOpts={renderOpts} params={params}></oMultiSelector>
    );
  },
  renderTableEdit(h, renderOpts, params) {
    return [
      <oMultiSelector renderOpts={renderOpts} params={params}></oMultiSelector>
    ];
  },
  renderTableCell(h, renderOpts, params) {
    return [
      <oMultiSelectorCell
        renderOpts={renderOpts}
        params={params}
      ></oMultiSelectorCell>
    ];
  }
});
